<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>我的会员</title>
	<link rel="stylesheet" type="text/css" href="<?=base_url()?>public/css/style.css">
	<script type="text/javascript" src="<?=base_url()?>public/js/jq.1.12.4.js"></script>
	<script type="text/javascript" src="<?=base_url()?>public/js/js.js"></script>
	<script src="<?=base_url()?>public/js/jquery.ztree.core.js"></script>
	<style type="text/css">
		*{box-sizing: border-box}
		.table tr th{width:16.6%}
		#root label{height:100%;line-height:30px;display:inline-block;width:100%;border-bottom: 1px solid #e9e9e9}
		label a{display: inline-block;width:100%}
		label a i{display: inline-block;width:16.6%;float:left;font-style: normal;line-height:20px;height:100%;padding-top:10px; text-align:center;}
		#root li{line-height:30px;position:relative;}
		#root .two{display:none;padding-left:20px;}
		#root span{position:absolute;top:13px;}
		#root .add{background:url(<?=base_url()?>public/img/tb.gif) -4px -31px no-repeat;}
		#root .ren{background:url(<?=base_url()?>public/img/tb.gif) -4px -7px no-repeat;}
		#root .btn_add{position:absolute;top:13px;display: inline-block; height: 18px; vertical-align: middle; width: 16px; cursor: pointer;}

		#root {
		margin-left:10px;
		}
		#root a{text-decoration: none;color:#333}
		#root li {
			list-style-type:none;
			margin:0;
			position:relative
		}
		#root .two li::before, #root .two li::after {
			content:'';
			left:-20px;
			position:absolute;
			right:auto
		}
		#root .two li::before {
			border-left:1px dotted #999;
			height:100%;
			left:-11px;
			top:-15px;
			width:1px
		}
		#root .two li::after {
			border-top:1px dotted #999;
			height:20px;
			top:21px;
			left:-11px;
			width:15px
		}
		#root .two li.parent_li>label {
			cursor:pointer
		}
		#root .two>ul>li::before, #root .two>ul>li::after {
			border:0
		}
		#root .two li:last-child::before {
			height:35px
		}

		.leftnav h3 .jiantou{right:15px !important;}
	</style>
</head>
<body>
	<!-- 头部 -->
	<?php echo $menu ?>
	<!-- 主体 -->
	<div class="main clearfix">
		<?php echo $left ?>
		<div class="content">
			<div class="con">
				<div class="bikuang">
					<input type="hidden" id="dqjb" name="dqjb" value="<?php echo $dqjb; ?>" />
                	<div class="right_title">
	                	<span>公益团队中心&nbsp;&nbsp; -</span>
	                	<span style="color:#1d3e00; margin:0;">&nbsp;&nbsp;我的会员</span>
                	</div>
                	<div class="table">
                    	<table cellpadding="0" cellspacing="0">
                        	<tr>
                            	<th>公益账号</th>
                                <th>姓名</th>
                                <th>推广人数</th>
                                <th>级别</th>
                                <th>手机号</th>
								<th>状态</th>
                            </tr>
                            <tr>
								<td colspan="6">
									<ul id="root">
									<?php foreach ($member_list as $key => $v):?>
										<li>
											<?php if($v['tj_num'] > 0): ?>
												<span class="add btn_add" acc="<?php echo $v['user_account'] ?>" abb="1" >
												</span>
											<?php endif; ?>
											<label>
												<a href="javascript:">
													<i><?php echo substr_replace($v['user_account'],'***',2,3) ?></i>
													<i><?php echo $v['user_name'] ?></i>
													<i><?php echo $v['tj_num'] ?></i>
													<i><?php echo $v['tlv'] ?></i>
													<i><?php echo $v['mobile'] ?></i>
													<i><?php if($v['kick_status'] == '1') {echo "已封号";} else {echo "正常";}?></i>
												</a>
											</label>
										</li>
									<?php endforeach;?>
									</ul>
								</td>
                            </tr>
                        </table>
               		</div>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript" >
var url = '<?php echo site_url('my_member/ajax_get_member_list') ?>';
var canDown=true;
var time=0;

$('#root').delegate('.btn_add','click', function aa(event) {
	//console.log(this);
	//$(this).removeClass('add');
	if(event.target.nodeName==="SPAN"){
		var time1=new Date().getTime();
		if(time1-time>=300){
			time=time1;
			$_this = $(this);
			$_this.off('click');
			if($_this.hasClass('ren')){
				//console.log(2);
				canDown=true;
				$_this.parent().children('ul').remove('.two');
				$_this.removeClass('ren').addClass('add');
				$_this.on('click',aa);
			}else{
				if($_this.attr('acc')){
					if ($('#dqjb').val() == $_this.attr('abb')) {
						alert("会员只能查看"+$('#dqjb').val()+"代");
						return;
					}
					if ($_this.attr('abb') == '5') {
						alert("会员只能查看5代");
						return;
					} else {
						var abb= parseInt($_this.attr('abb')) + parseInt(1);
					}
					if(canDown){
						canDown=true;
						$.post(url, {'acc':$_this.attr('acc')}, function(d) {
						//console.log(d);
							var html = '';
							html += '<ul class="two">';
							if(d){
								for (var i = 0; i < d.length; i++) {
									html += '<li>';
									if(d[i]['tj_num'] > 0){
										html += '<span class="add btn_add" acc="'+d[i]['user_account']+'" abb="'+abb+'"></span>'
									}
									html += '<label>';
									html += '<a href="javascript:">'
									html += '<i>'+d[i]['user_account'].substr(0, 2)+'***'+d[i]['user_account'].substr(5)+'</i>';
									html += '<i>'+d[i]['user_name']+'</i>';
									html += '<i>'+d[i]['tj_num']+'</i>';
									html += '<i>'+d[i]['tlv']+'</i>';
									html += '<i>无权限</i>';
									if (d[i]["kick_status"] == "1"){
										html += '<i>已封号</i>';
									} else {
										html += '<i>正常</i>';
									}
									
					//					html += '<i>'+d[i]['mobile']+'</i>';
									html += '</a>';
									html == '</label>';
									html += '</li>';
								}
							}
							html += '</ul>';
							console.log($_this.siblings(".two").length);
							if($_this.siblings(".two").length>=1){
								return;
							}else{
								$($_this.parent()).append(html);
								$_this.removeClass('add');
								$_this.addClass('ren');
								$_this.on('click',aa);
								$('.two').show();
							}
						});
					}
				}
			}
		}
	}
});
// $('.ren').on('click', function(event) {
//     console.log(111);
// });

		// function addEvent(el,name,fn){//绑定事件
		// 	if(el.addEventListener) return el.addEventListener(name,fn,false);
		// 	return el.attachEvent('on'+name,fn);
		// }
		// function nextnode(node){//寻找下一个兄弟并剔除空的文本节点
		// 	if(!node)return ;
		// 	if(node.nodeType == 1)
		// 		return node;
		// 	if(node.nextSibling)
		// 		return nextnode(node.nextSibling);
		// }
		// function prevnode(node){//寻找上一个兄弟并剔除空的文本节点
		// 	if(!node)return ;
		// 	if(node.nodeType == 1)
		// 		return node;
		// 	if(node.previousSibling)
		// 		return prevnode(node.previousSibling);
		// }
		// function parcheck(self,checked){//递归寻找父亲元素，并找到input元素进行操作
		// 	var par = prevnode(self.parentNode.parentNode.parentNode.previousSibling),parspar;
		// 	if(par&&par.getElementsByTagName('input')[0]){
		// 		par.getElementsByTagName('input')[0].checked = checked;
		// 		parcheck(par.getElementsByTagName('input')[0],sibcheck(par.getElementsByTagName('input')[0]));
		// 	}
		// }
		// function sibcheck(self){//判断兄弟节点是否已经全部选中
		// 	var sbi = self.parentNode.parentNode.parentNode.childNodes,n=0;
		// 	for(var i=0;i<sbi.length;i++){
		// 		if(sbi[i].nodeType != 1)//由于孩子结点中包括空的文本节点，所以这里累计长度的时候也要算上去
		// 			n++;
		// 		else if(sbi[i].getElementsByTagName('input')[0].checked)
		// 			n++;
		// 	}
		// 	return n==sbi.length?true:false;
		// }
		// addEvent(document.getElementById('root'),'click',function(e){//绑定input点击事件，使用root根元素代理
		// 	e = e||window.event;
		// 	var target = e.target||e.srcElement;
		// 	var tp = nextnode(target.parentNode.nextSibling);
		// 	switch(target.nodeName){
		// 		case 'A'://点击A标签展开和收缩树形目录，并改变其样式会选中checkbox
		// 			if(tp&&tp.nodeName == 'UL'){
		// 				if(tp.style.display != 'block' ){
		// 					tp.style.display = 'block';
		// 					prevnode(target.parentNode.previousSibling).className = 'ren'
		// 				}else{
		// 					tp.style.display = 'none';
		// 					prevnode(target.parentNode.previousSibling).className = 'add'
		// 				}
		// 			}
		// 			break;
		// 		case 'SPAN'://点击图标只展开或者收缩
		// 			var ap = nextnode(nextnode(target.nextSibling).nextSibling);
		// 			if(ap.style.display != 'block' ){
		// 				ap.style.display = 'block';
		// 				target.className = 'ren'
		// 			}else{
		// 				ap.style.display = 'none';
		// 				target.className = 'add'
		// 			}
		// 			break;
		// 	}
		// });
		// window.onload = function(){//页面加载时给有孩子结点的元素动态添加图标
		// 	var labels = document.getElementById('root').getElementsByTagName('label');
		// 	for(var i=0;i<labels.length;i++){
		// 		var span = document.createElement('span');
		// 		span.style.cssText ='display:inline-block;height:18px;vertical-align:middle;width:16px;cursor:pointer;';
		// 		span.innerHTML = ' '
		// 		span.className = 'add';
		// 		if(nextnode(labels[i].nextSibling)&&nextnode(labels[i].nextSibling).nodeName == 'UL')
		// 			labels[i].parentNode.insertBefore(span,labels[i]);
		// 		else
		// 			labels[i].className = 'rem'
		// 	}
		// }
	</script>
</body>
</html>
